<!--
 * @Author: chunlai
 * @Date: 2024-01-05 13:52:26
 * @LastEditTime: 2025-11-27 08:38:34
 * @LastEditors: minsheng_insurance_agency_zhoucl
 * @FilePath: \01.latest-short-insure\src\renewal\LiBao.vue
 * @Description: 利宝
-->
<template>
  <div class="">
    <div class="user-model">
      <div class="main-model">
        <div class="head-model">
          <span class="head-model-label">客户信息</span>
        </div>
        <Appnt :msgObj="applicant" />
        <Insued
          :bindex="idex"
          :msgObj="bbritem"
          v-for="(bbritem, idex) in assuredList"
          :key="`bbr_obj${idex}`"
          :ref="`bbr${idex}renewal`"
        />
      </div>
    </div>
    <div class="user-model">
      <div class="main-model">
        <div class="head-model">
          <span class="head-model-label">保单信息</span>
        </div>
        <div class="cell3_main">
          <div class="cell3Item">
            <div class="cell3_label">起保日期</div>
            <div class="cell3_value">{{ effectiveDate }} 00:00:00</div>
          </div>
        </div>
        <div class="cell3_main">
          <div class="cell3Item">
            <div class="cell3_label">终保日期</div>
            <div class="cell3_value">{{ expiryDate }} 23:59:59</div>
          </div>
        </div>
      </div>
    </div>
    <div class="user-model" :class="{ disabledForm: disabledEdit }">
      <div class="main-model">
        <div class="head-model">
          <span class="head-model-label">险种信息</span>
        </div>
        <LiBaoRisk />
      </div>
    </div>
    <div class="user-model">
      <div class="main-model">
        <div class="head-model">
          <span class="head-model-label">投保条款阅读</span>
        </div>
        <ProtocolsReading id="protocols_module" />
      </div>
    </div>
    <div class="user-model">
      <div class="main-model">
        <div class="head-model">
          <span class="head-model-label">请完成以下签字</span>
        </div>
        <QianZiListModule ref="qianziList" id="sign_module" />
      </div>
    </div>
    <FooterBtns
      btnNum="1"
      :rightText="btnText"
      @saveForm="saveBefore"
    ></FooterBtns>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import Appnt from "./components/Appnt.vue";
import Insued from "./components/Insued.vue";
import LiBaoRisk from "./components/LiBaoRisk.vue";
import ProtocolsReading from "@/views/sign/components/ProtocolsReading.vue";
import QianZiListModule from "@/views/sign/components/QianZiListModule";
import { underwrite, payment } from "@/utils/functions";
import { getStartDate, getEndDate } from "@/methods/date.js";
import { rebackUrlPath } from "@/methods/format.js";
import { checkPhoneSmsCode } from "@/methods/apis.js";
export default {
  name: "RenewalLiBao",
  components: {
    Appnt,
    Insued,
    LiBaoRisk,
    ProtocolsReading,
    QianZiListModule,
  },
  data() {
    return {
      effectiveDate: "",
      expiryDate: "",
    };
  },
  computed: {
    ...mapGetters({
      cont: "insert/cont",
      applicant: "insert/applicant",
      assuredList: "insert/assuredList",
      msChannel: "insert/msChannel",
      yunUserId: "yunUserId",
      preOrderNum: "preOrderNum",
      signDoneFlag: "home/signDoneFlag",
      showedRisks: "risks/showedRisks",
      readFinish: "readings/wholeFinish",
      underwriteFlag: "insert/underwriteFlag",
      contExpiryDate: "renewal/contExpiryDate",
    }),
    btnText() {
      let res = "去核保";
      if (["1", "4"].includes(this.underwriteFlag)) {
        res = "去支付";
      } else if (["5"].includes(this.underwriteFlag)) {
        res = "下一步";
      }
      return res;
    },
  },
  watch: {},
  created() {
    let beginDay = getStartDate(1);
    if (this.contExpiryDate) {
      const nowTimer = new Date().getTime(),
        preTimer = new Date(this.contExpiryDate).getTime();
      if (preTimer > nowTimer) {
        beginDay = getStartDate(1, this.contExpiryDate);
      }
    }
    this.effectiveDate = beginDay;
    this.expiryDate = getEndDate(beginDay);
  },
  mounted() {
    if (this.$getMessage("readFinish") == "1") {
      this.$store.dispatch("readings/setWholeFinish");
    }
  },
  methods: {
    async saveBefore() {
      let flag = "";
      const bnfLen = this.assuredList.length;
      for (let i = 0; i < bnfLen; i++) {
        const item = this.assuredList[i];
        const bbrLabel = `被保险人${bnfLen > 1 ? `${i + 1}` : ""}`;
        if (!item.healthyStatus) {
          flag = `请确认${bbrLabel}健康告知`;
          break;
        } else if (item.healthyStatus == "N") {
          flag = `${bbrLabel}健康告知不通过，不可投保`;
          break;
        }
      }
      if (!this.applicant.validCode) return this.$toast("请输入短信验证码");
      // 校验短信验证码
      this.$store.commit("updateLoad", true);
      let res = await checkPhoneSmsCode(
        this.applicant.phone,
        this.applicant.validCode
      );
      this.$store.commit("updateLoad", false);
      if (res.code != 1) {
        flag = "短信验证码校验失败，请确认手机号和验证码是否匹配";
      }
      if (flag) return this.$baseAlert(flag);
      if (["1", "4"].includes(this.underwriteFlag)) {
        return this.goPayHandle();
      }
      if (!this.readFinish) {
        let target = document.querySelector("#protocols_module");
        target.scrollIntoView({
          behavior: "smooth",
          block: "start",
        });
        return this.$toast("请完成以上条款的阅读");
      }
      if (!this.signDoneFlag) {
        let target = document.querySelector("#sign_module");
        target.scrollIntoView({
          behavior: "smooth",
          block: "start",
        });
        return this.$toast("请完成以上签名");
      }
      this.$setMessage("readFinish", "1");
      // 再次试算
      this.$store.dispatch("risks/setRisks", {}).then((res) => {
        this.saveUserInfo();
      });
    },
    saveUserInfo() {
      this.$store
        .dispatch("apis/userSaveApi", this.apiComParams)
        .then((data) => {
          if (data.code == "1") {
            this.saveRisksApi();
          } else {
            this.$baseAlert(data.msg);
          }
        });
    },
    saveRisksApi() {
      this.$store
        .dispatch("apis/riskSaveApi", this.apiComParams)
        .then((data) => {
          if (data.code == "1") {
            this.underwriteApi();
          } else {
            this.$baseAlert(data.msg);
          }
        });
    },
    underwriteApi() {
      this.$store.commit("updateLoad", true);
      this.$store.commit("updateLoadTxt", "正在核保中，请稍等");
      let params = {
        ...this.apiComParams,
      };
      params.preOrderNum = this.preOrderNum;
      underwrite(params).then(
        ({ data }) => {
          this.$store.commit("updateLoad", false);
          this.$store.commit("insert/SET_UNDERWRITE_FLAG", data.code || "0");
          if (data.contractNum) {
            this.$store.commit("SET_CONTRACT_NUM", data.contractNum);
          }
          if (!["0", "2"].includes(data.code)) {
            this.$store.commit("insert/SET_FORBID_ALTER", true);
          }
          this.$baseAlert(data.msg, () => {
            if (["5"].includes(data.code)) {
              this.$router.push("/billres");
            }
          });
        },
        (err) => {
          this.$store.commit("updateLoad", false);
        }
      );
    },
    // 支付
    goPayHandle() {
      let params = {
        ...this.apiComParams,
        successUrl: `${rebackUrlPath("#/billres")}`,
        failUrl: `${rebackUrlPath("#/billres")}`,
      };
      this.$store.commit("updateLoad", true);
      payment(params).then(
        ({ data }) => {
          this.$store.commit("updateLoad", false);
          if (data.code == "1") {
            if (data.url) {
              this.formChannelPay(data.url);
            }
          } else {
            this.$baseAlert(data.msg);
          }
        },
        (err) => {
          this.$store.commit("updateLoad", false);
        }
      );
    },
    formChannelPay(payUrl) {
      this.$nextTick(() => {
        var form = document.createElement("form");
        form.id = "ms-pay-form";
        document.body.appendChild(form);
        let input = document.createElement("input");
        input.type = "hidden";
        input.name = "requestDoc";
        // input.value = data;
        form.setAttribute("accept-charset", "gbk");
        form.appendChild(input);
        form.method = "GET";
        form.action = payUrl;
        form.submit();
      });
      document.body.removeChild(form);
    },
  },
};
</script>
<style lang="less" scoped>
@import "../views/form/style.less";
.user-model {
  padding: 0 5px;
  margin-top: 10px;
  .main-model {
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
    .head-model {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 40px;
      padding: 0 10px;
      font-size: 16px;
      line-height: 1;
      padding-left: 8px;
      font-family: MiSans;
      font-weight: 600;
      color: #242424;
      border-bottom: 1px dashed #ebedf0;
      &-label {
        position: relative;
        &::after {
          content: "";
          position: absolute;
          top: 1px;
          left: -7px;
          width: 2px;
          height: 90%;
          border-radius: 2px;
          background-color: #f54040;
        }
      }
    }
  }
}

.cell3_main {
  padding: 0 12px;
}
.cell3Item {
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  min-height: 40px;
  position: relative;

  &::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-bottom: 1px solid #ededed;
    transform: scaleY(0.5);
  }

  .cell3_label {
    display: flex;
    align-items: center;
    width: 80px;
    height: 26px;
    color: #747474;
  }

  .cell3_value {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: calc(100% - 90px);
    height: 26px;
  }
}
</style>
